<script>
  import $ from 'dfish-widget'
  import Method from '../Method.vue'

  export default {
    mixins: [Method],
    data() {
      return {
        name: '变量样式',
        remark: '配置全局变量样式',
        attrs: [{
          name: '--w--primary-color',
          remark: '主色调的颜色值',
        }, {
          name: '--w--primary-hover-color',
          remark: '鼠标移到主色调颜色上时的值',
        }, {
          name: '--w--vice-color',
          remark: '副色调的颜色值。一般是主色调为深色，副色调为浅色',
        }, {
          name: '--w-grid-cell-border-color',
          remark: 'grid网格边线颜色值',
        }, {
          name: '--w-grid-cell-label-background-color',
          remark: 'grid网格label背景色值',
        }, {
          name: '--w-table-border-color',
          remark: 'table边线颜色值',
        }, {
          name: '--w-td-border-color',
          remark: '表格td单元格边线颜色值',
        }, {
          name: '--w-thead-background-color',
          remark: '表格thead表头背景色值',
        },],
        examples: [{
          remark: '系统默认的变量值',
          type: 'html',
          code: `
            <style>
              :root {
                --w--primary-color: #2498ff;
								--w--primary-hover-color: #2498ff;
								--w--vice-color: #e6f7ff;
                --w-grid-cell-border-color: #ddd;
                --w-grid-cell-label-background-color: #f9f9f9;
                --w-table-border-color: #ddd;
                --w-td-border-color: #eee;
                --w-thead-background-color: #eee;
              }
            </style>
            `
        }]
      }
    }
  }
</script>
